<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>vuecss动画效果</title>
	<script src="js/vue.js"></script>
	<style>
		/*显示动画*/ /*隐藏动画*/
		.v-enter,.v-leave-to{
		opacity: 0;
		}
		.v-enter-active,.v-leave-active{
		transition: opacity 3s;
		}
	</style>
</head>
<body>
<div id="app">
<transition>
	<div v-if="seen">hello wolrd!</div>
</transition>
	<button @click="handleclick">click</button>
</div>
<script>
let app = new Vue({
   el:"#app",
   data:{
     seen:true
	},
	methods:{
   	handleclick:function(){
         this.seen = !this.seen
       }
	}
})
</script>
</body>
<!--
transition:vue动画标签
-->
</html>